<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Scroll to top</title>
<style type="text/css">
div { width:950px; height:300px; background:#CCC; position:relative; margin:0 auto; }
.quicktop, .quicktop span { display:block; }
.quicktop { position:absolute; right:-10px; }
.quicktop span { position:fixed; top:80%; }
</style>
<script type="text/javascript" src="../js/mootools-1.4.5.js"></script>
<script type="text/javascript" src="http://demo.joomla.cn/media/system/js/mootools-more.js"></script>
<script type="text/javascript">
var quicktop = function() {
	var winScroller = new Fx.Scroll(window);
	winScroller.toTop();
}
window.addEvent('domready',function() {
	$$('.quicktop').addEvent('click',quicktop);
	backToTopFun;
});
window.addEvent('scroll',function() {
	var st = document.getScroll().y, winh = window.getSize().y;
	(st > 10)? $$('.quicktop').setStyle("display", "block"): $$('.quicktop').setStyle("display", "none");
	//IE6下的定位
	if (!window.XMLHttpRequest) {
		$$('.quicktop').setStyle("top", st + winh - 166);
	}
})
</script>
</head>

<body>
<div>A(01)</div>
<hr />
<div>B(02)</div>
<hr />
<div>C(03)</div>
<hr />
<div>E(04)</div>
<hr />
<div>E(05)</div>
<hr />
<div>F(06)</div>
<hr />
<div>G(07)</div>
<hr />
<div>H(08)</div>
<hr />
<div>I(09)</div>
<hr />
<div>J(10) <a class="quicktop"><span>Top</span></a> </div>
<hr />
</body>
</html>
